import { Component, OnDestroy, OnInit } from '@angular/core';
import { HomeService } from '@service/home.service';
import { option } from './option';
import { Router } from '@angular/router';
declare const ActiveXObject: any;
@Component({
	selector: 'app-home',
	templateUrl: './home.component.html',
	styleUrls: ['./home.component.less']
})
export class HomeComponent implements OnInit, OnDestroy {
	showTime = '当前时间：2021年6月14-2时58分51秒';

	disclose = {
		num: 0
	};
	addrStatistics = null;
	gride = null;
	visitTotal = {
		total1: 0,
		total2: 0,
		total3: 0
	}
	visitEchartsOpt1 = null;
	visitEchartsOpt2 = null;
	visitEchartsOpt3 = null;

	timeTimer = null;
	echartTimer = null;

	get isFullscreen() {
		return !location.href.includes('/page/home')
	}
	constructor(
		private homeService: HomeService,
		private router: Router
	) { }
	ngOnDestroy(): void {
		if (this.timeTimer) {
			clearInterval(this.timeTimer);
		}
		if (this.echartTimer) {
			clearInterval(this.echartTimer);
		}
	}

	ngOnInit() {
		this.setShowTime();
		this.init();
		this.echartTimer = setInterval(_ => {
			this.init();
		}, 5000);
	}

	goHome() {
		this.router.navigateByUrl('/home');
		this.fullScreen();
	}
	goPageHome() {
		this.router.navigateByUrl('/page/home');
		this.exitFullscreen();
	}

	fullScreen() {
		const el = document.documentElement as any;
		const rfs = el.requestFullscreen || el.webkitRequestFullscreen ||
			el.mozRequestFullScreen || el.msRequestFullScreen;
		if (typeof rfs != "undefined" && rfs) {
			rfs.call(el);
		} else if (typeof (window as any).ActiveXObject != "undefined") {
			//for IE，这里其实就是模拟了按下键盘的F11，使浏览器全屏
			const wscript = new ActiveXObject("WScript.Shell");
			if (wscript != null) {
				wscript.SendKeys("{F11}");
			}
		}
	}

	exitFullscreen() {
		if (document.exitFullscreen) {
			document.exitFullscreen();
		} else if ((document as any).msExitFullscreen) {
			(document as any).msExitFullscreen();
		} else if ((document as any).mozCancelFullScreen) {
			(document as any).mozCancelFullScreen();
		} else if ((document as any).webkitExitFullscreen) {
			(document as any).webkitExitFullscreen();
		}
	}
	
	setShowTime() {
		this.timeTimer = setInterval(_ => {
			let dt = new Date();
			const y = dt.getFullYear();
			const mt = dt.getMonth() + 1;
			const day = dt.getDate();
			const h = dt.getHours();//获取时
			const m = dt.getMinutes();//获取分
			const s = dt.getSeconds();//获取秒
			this.showTime = '当前时间：' + y + "年" + mt + "月" + day + "-" + h + "时" + m + "分" + s + "秒";
		}, 1000);
	}
	private init() {
		this.discloseEchart();
		this.addrStatisticsCommunity();
		this.griderStatistic();
		this.visitEchart1();
		this.visitEchart2();
		this.visitEchart3();

	}

	private async discloseEchart() {
		const result = await this.homeService.discloseEchart();
		this.disclose.num = result.num;
	}
	private async addrStatisticsCommunity() {
		const result = await this.homeService.addrStatisticsCommunity();
		const areaTotal = result.areas.reduce((total, value) => {
			return total + value.total;
		}, 0);

		this.addrStatistics = { ...result, areaTotal };
	}
	private async griderStatistic() {
		const result = await this.homeService.griderStatistic();
		const griderTotal = result.griders.reduce((total, value) => {
			return total + value.total;
		}, 0);
		const griders = new Array(3);
		result.griders.forEach(it => {
			griders[it.typeName * 1 - 1] = it.total;
		});
		this.gride = {
			griderNum: result.griderNum,
			griders,
			griderTotal
		};
	}
	private async visitEchart1() {
		const result = await this.homeService.visitEchart('1');
		this.visitTotal.total1 = result.data.reduce((total, value) => {
			return total + value.total;
		}, 0);
		const xAxis = result.data.map(it => it.dates);
		option.xAxis[0].data = xAxis;
		const series = result.data.map(it => it.dates);
		option.series[0].data = series;
		this.visitEchartsOpt1 = option;
		this.visitEchartsOpt1 = { ...this.visitEchartsOpt1 };

	}
	private async visitEchart2() {
		const result = await this.homeService.visitEchart('2');
		this.visitTotal.total2 = result.data.reduce((total, value) => {
			return total + value.total;
		}, 0);
		const xAxis = result.data.map(it => it.dates);
		option.xAxis[0].data = xAxis;
		const series = result.data.map(it => it.dates);
		option.series[0].data = series;
		this.visitEchartsOpt2 = option;
		this.visitEchartsOpt2 = { ...this.visitEchartsOpt2 };

	}
	private async visitEchart3() {
		const result = await this.homeService.visitEchart('3');
		this.visitTotal.total3 = result.data.reduce((total, value) => {
			return total + value.total;
		}, 0);
		const xAxis = result.data.map(it => it.dates);
		option.xAxis[0].data = xAxis;
		const series = result.data.map(it => it.dates);
		option.series[0].data = series;
		this.visitEchartsOpt3 = option;
		this.visitEchartsOpt3 = { ...this.visitEchartsOpt3 };
	}
}
